package classes
{
	import UIFree.uif_styles;
	
	import UIUtils.uif_util;

	public dynamic class vk_styles extends uif_styles {
		private static const TAHOMA: String = 'tahoma';
		private static const ARIAL: String = 'arial';
		
		public function vk_styles() {
			super();
			var defShadow: Object = {
					distance: 1,
					angle: 80,
					blurX: 5,
					blurY: 5,
					color: 0,
					strength: 2
				};
				
			var shadow2: Object = {
				distance: 2,
				angle: 45,
				blurX: 5,
				blurY: 5,
				color: 0,
				strength: 1.2
			}
				
			var buttonFill: Object = {
					colors: [0xffffee, 0x584F26],
					rotation: Math.PI / 2
				};

			var fillDefPapper: Object = {
					rotation: Math.PI / 2,
					colors: [0xFFFFFF, 0xDDDDDD],
					alphas: [1, 1]
				};
			var cb: Object =  {
					buttonMode: true,
					mouseChildren: false
				};
				
			this['application'] = {
				fill_color: 0xFFFFFF,
				fill_alpha: 1
			}
			
			this['modalGurtain'] = {
				fill_color: 0xFFFFFF,
				fill_alpha: 0.8
			}
				
			this['description'] = {
				line_width: 1,
				line_color: 0xCCCDDD,
				rounds: 6,
				padding: 10,
				valign: true,
				text_format: {
					font: ARIAL,
					size: 11,
					wordWrap: true
				}
			}
			
			this['block'] = {
				line_width	: 1,
				line_color	: 0xD9E0E7,
				fill_color	: 0xF7F7F7,
				fill_alpha	: 1,
				rounds		: 15,
				padding		: 6,
				margin		: 2
			}
			
			this['tblock'] = merge('block', {
				line_alpha: 0.5,
				fill_alpha: 0.5
			});
			
			this['wblock'] = {
				line_width	: 1,
				line_color	: 0x4C7097,
				fill_color	: 0xFFFFFF,
				fill_alpha	: 1,
				rounds		: [15,0,0,15],
				padding		: 6,
				margin		: 1
			}
			
			this['block-title'] = {
				text_format: {
					font: ARIAL,
					size: 15,
					bold: true,
					wordWrap: true,
					color: 0x333444,
					multiline: true,
					selectable: false
				}
			}
			
			this['help'] = merge('block', {
				text_format: {
					font: TAHOMA,
					size: 10,
					wordWrap: true,
					color: 0x333444,
					multiline: true,
					selectable: false
				}
			});
			
			this['userName'] = {
				text_format: {
					font: ARIAL,
					size: 10,
					color: 0x555555,
					align: 'center',
					wordWrap: true
				}
			}
			
			this['userAvatar'] = {
				text_format: {
					font: TAHOMA,
					size: 9,
					color: 0x666788,
					align: 'center',
					wordWrap: true,
					leading: -2
				}
			}
			
			this['windowTitle'] = {
				line_width: 2,
				line_color: 0xFFFFFF,
				fill_color: 0x00468C,
				fill_alpha: 1,
				rounds: 14,
				padding: 4,
				valign: true,
				text_format: {
					font: ARIAL,
					size: 15,
					bold: true,
					color: 0xFFFFFF
				},
				filters: {
					glow: {
						color: 0
					}
				},
				component: cb
			}
			
			this['window'] = {
				title: 'windowTitle',
				line_width: 1,
				line_color: 0x0,
				fill_color: 0x979A9A,
				fill_alpha: 1,
				rounds: 10,
				padding: 10,
				filters: {
					shadow: defShadow
				}
			}
			
			this['editor'] = {
				padding: 5,
				filters: {
					shadow: defShadow
				}
			}
			
			this['fullView'] = {
				fill_color: 0xFFFFFF,
				fill_alpha: 1
			}
			
			this['tabBox'] = {
				tab_class: 'tab',
				tab_height: 25,
				tabitem_class: 'tabItem_unselect',
				layer_class: 'tab',
				itemslayer_class: 'items',
				item_class: 'userPhoto'
			}
			
			this['photo'] = {
				line_width: 1,
				line_color: 0x4C7097,
				fill_color: 0xFFFFFF,
				fill_alpha: 1,
				rounds: 0,
				padding: 3,
				margin: 2,
				filters: {}
			}

			this['photoEditor'] = {
				line_width: 1,
				line_color: 0x4C7097,
				fill_color: 0xFFFFFF,
				fill_alpha: 1,
				rounds: 5,
				padding: 20,
				margin: 3
			}
			
			
			this['preview'] = {
				component: cb
			};
			
			this['tabBlock'] = {
				margin: 2,
				padding: 5,
				rounds: 6,
				fill_color: {
					rotation: Math.PI / 2,
					colors: [0xFFFFFF, 0xE5EEFF],
					alphas: [1, 1]
				},
				fill_alpha: 1,
				valign: true,
				text_format: {
					color: 0,
					font: ARIAL,
					size: 11,
					wordWrap: true,
					align: 'center'
				},
				filters: {
					shadow: defShadow
				}
			}
			
			this['buttonB'] = {
				fill_color: 0x5E82A8,
				fill_alpha: 1,
				line_width: 1,
				line_color: 0x4C7097,
				padding	  : 2,
				margin		: 4,
				rounds		: 15,
				text_format: {
					color: 0xBBCDCF,
					font: TAHOMA,
					size: 14,
					align: 'center',
					selectable: false
				},
				component: cb,
				filters: {
					shadow: defShadow
				},
				overClass: 'buttonBFocus'
			}
			
			this['saveB'] = merge('buttonB', {
				fill_color: 0x007700
			});
			
			this['buttonBFocus'] = merge('buttonB', {
				fill_color: 0x4C6487,
				fill_alpha: 1,
				line_width: 1,
				line_color: 0xCCBFEE,
				padding: 4,
				text_format: {
					color: 0xFFFFFF
				}
			});
			
			this['isHeader'] = {
				fill_color: 0xAAA9A9,
				fill_alpha: 1,
				rounds: 12,
				filters: {
					shadow: shadow2
				}
			}
			
			this['num'] = merge('isHeader', {
				component: cb,
				text_format: {
					color: 0xFFFFFF,
					font: 'times',
					size: 28,
					align: 'center',
					selectable: false
				}
			});
			
			this['indArrow'] = {
				fill_color: 0xFF0033,
				fill_alpha: 1,
				line_color: 0,
				line_alpha: 1,
				filters: {
					shadow: shadow2
				}
			}
			
			this['arrow2'] = {
				'arrow': 'indArrow'
			}
			
			this['tabItem'] = merge('tabBlock', {
				fill_color: 0xF7F7F7,
				padding: 0,
				valign: true,
				component: cb,
				text_format: {
					color: 0,
					font: ARIAL,
					size: 11,
					wordWrap: true,
					align: 'center'
				}
			})
			
			this['tabItem_unselect'] = merge('tabItem', {
				fill_color: 0x4C7097,
				fill_alpha: 1,
				text_format: {
					color: 0xCCEEFF,
					font: ARIAL,
					size: 11,
					wordWrap: true,
					align: 'center'			
				},
				filters: {}
			})
			
			this['userPhoto'] = merge('photo', {
			});
			
			this['userPhoto_select'] = merge('tabBlock', {
			});
			
			
			this['tab'] = {
				arrow: 'farrow',
				area: 'tabArea',
				select: 'tabItem',
				unselect: 'tabItem_unselect'
			}
			
			this['items'] = {
				arrow	: 'farrow',
				area	: 'tabArea',
				select	: 'userPhoto_select',
				unselect: 'userPhoto'
			}
			
			this['tabArea'] = {
			}
			
			this['tabArrow'] = {
				line_width: 1,
				fill_color: 0x555666,
				fill_alpha: 1,
				component: cb
			}
			
			this['arrow'] = {
				line_width:1, 
				line_color: 0xFFFFFF, 
				fill_color: 0x5977B3,
				fill_alpha: 1,
				orientation: 3,
				filters: {
					shadow: shadow2
				}
			};
			
			this['arrowFocus'] = merge('arrow', {
				fill_color: 0x00FF00,
				fill_alpha: 1
			});
			
			this['farrow'] = {
				padding: 4,
				arrow: 'arrow',
				component: cb
			}
			
			this['cross'] = {
				line_width: 2,
				padding: 4,
				component: cb,
				filters:{
					shadow: defShadow
				},
				round: {
					line_width: 2,
					line_color: 0xFFFFFF,
					fill_color: 0,
					fill_alpha: 0.5
				}
			}
			
			this['delButton'] = merge('cross', {
				line_color: 0xFF0000
			})
			
			this['closeButton'] = merge('cross', {
				line_color: 0xFFFFFF
			})
			
			this['button'] = {
				overClass: 'over_button',
				downClass: 'button',
				arrow: 'arrow',
				line_width:1,
				margin: 5,
				rounds: 5,
				component: cb,
				text_format: {
					selectable: false,
					font: TAHOMA,
					size: 11,
					align: 'center'
				},
				fill_color: buttonFill,
				filters:{
					shadow: {
						distance: 1,
						angle: 10,
						blurX: 2,
						blurY: 2
					},
					bevel: {
						distance: 1,
						blurX: 1,
						blurY: 1
					}
				}
			}
			
			this['over_button'] = {
				arrow: 'arrowFocus',
				line_width:1, 
				margin: 5,
				rounds: 5, 
				fill_color: {
					colors: [0x888999, 0xFFFFFF],
					rotation: Math.PI / 2
				},
				component: cb,
				filters:{
					shadow: {
						distance: 2,
						angle: 10,
						blurX: 3,
						blurY: 3
					},
					bevel: {
						distance: 1,
						blurX: 1,
						blurY: 1
					}
				}
			}
			
			this['minput'] = {
				line_width: 1,
				line_color: 0x666777,
				fill_color: {
					rotation: Math.PI / 2,
					colors: [0xFFFFFF, 0xDDDEEF]	
				},
				text_format: {
					font: ARIAL,
					size: 12,
					selectable: true,
					multiline: true,
					wordWrap: true,
					type: 'input'
				}
			}
			
/*			this['loaderLine'] = {
				line_width: 1,
				line_color: 0,
				line_alpha: 0.3,
				rounds: 5,
				fill_color: {
					colors: [0x00FF00, 0],
					alphas: [1, 1],
					rotation: Math.PI / 2
				}
			}
			
			this['loaderBar'] = {
				barClass: 'loaderLine',
				text_format: {
					font: ARIAL,
					size: 11,
					bold: true,
					color: 0x222222,
					selectable: false,
					align: 'center'
				}
			}
			
			this['info'] = {
				text_format: {
					font: ARIAL,
					size: 11,
					color: 0x333444,
					selectable: false,
					wordWrap: true,
					multiline: true
				}
			}
			
			this['infoTmpl'] = {
				text_format: {
					font: TAHOMA,
					size: 9,
					color: 0x333444,
					selectable: false,
					wordWrap: true,
					multiline: true,
					align: 'center'
				}
			}

			this['balance'] = {
				text_format: {
					font: ARIAL,
					size: 14,
					color: 0xFFFFFF,
					selectable: false
				},
				component: cb
			}
			
			this['collection'] = {
				text_format: {
					font: ARIAL,
					size: 13,
					multiline: true,
					selectable: false
				},
				filters:{
					shadow: {
						distance: 2,
						angle: 45,
						blurX: 2,
						blurY: 2
					}
				}
			}
			
			this['collectButtonCheck'] = {
				line_width: 1,
				line_color: 0x336633,
				fill_color: {
					colors: [0x00EE00, 0x00DD00],
					rotation: Math.PI / 2
				},
				rounds: 3,
				component: cb	
			}
			
			this['collectButton'] = {
				line_width: 1,
				line_color: 0x336633,
				rounds: 2,
				component: cb
			}*/
			
			this['vRect'] = {
				line_width: 1,
				line_color: 0x00FF00,
				line_alpha: 0.8,
				fill_color: 0xFF0000,
				fill_alpha: 0.2
			}
			
			this['selectRect'] = {
/*				line_width: 1,
				line_color: 0x00FF00,
				line_alpha: 0.8,
				fill_color: 0xFF0000,
				fill_alpha: 0.2*/
			}
			
			this['ctrlRect'] = {
				line_color: 0xFFFFFF,
				line_width: 1,
				line_alpha: 0.5,
				fill_color: 0x0,
				fill_alpha: 0.8,
				component: cb
			}
			
			this['tools'] = {
				block: 'block',
				align: 'right'
			}
			
			this['wtools'] = {
				block: 'wblock',
				align: 'right'
			}
			
			this['bflat'] = {
				fill_color: 0xE5EEFF,
				fill_alpha: 1,
				arrow: 'arrow'
			}
			
			this['menuItem'] = {
				fill_color	: {
					colors: [0x5977B3, 0x002233],
					alphas: [0, 0],
					type: 'radial'
				},
				rounds		: 3,
				padding		: 2,
				text_format: {
					font	: ARIAL,
					size	: 11,
					color	: 0
				},
				component: {
					mouseChildren	: false,
					buttonMode		: true
				},
				overClass: 'menuItemFocus'
			}
			
			this['menuItemFocus'] = uif_util.union(this['menuItem'], {
				fill_color	: {
					alphas: [1, 1]
				},
				text_format: {
					color	: 0xFFFFFF
				}
			});
			
			this['popupmenu'] = {
				fill_color	: 0xEEEEEE,
				fill_alpha	: 1,
				line_color	: 0x888888,
				line_width	: 1,
				rounds		: 5,
				padding		: 8,
				item		: 'menuItem',
				filters: {
					shadow: {
						blurX: 5,
						blurY: 5,
						distance: 3
					}
				}
			}
			
			this['list'] = {
				line_width: 1,
				line_alpha: 0.5,
				rounds: 10,
				fill_color: 0xFFFFFF,
				fill_alpha: 1,
				buttonSize: 30,
				padding: 5,
				buttonClass: 'listButton',
				selectClass: 'listItemSelect',
				inputClass: 'slInput'
			}
			
			this['slInput'] = {
				line_width: 1,
				line_alpha: 0.5,
				margin: 5,
				text_format: {
					font: ARIAL,
					size: 12
				}
			}
			
			this['listItem'] = {
				fill_color: {
					colors: [0xFFFFFF, 0xFFFFFF]
				},
				padding: 2,
				rounds: 4,
				text_format: {
					font: ARIAL,
					size: 12,
					wordWrap: true,
					color: 0x333444,
					multiline: true,
					selectable: false
				},
				filters: {}
			}
			
			this['listItemFocus'] = uif_util.union(this['listItem'], {
				fill_color: {
					colors: [0x002233, 0x5977B3]
				},
				text_format: {
					color: 0xFFFFFF
				}
			});
			
			this['listItemSelect'] = uif_util.union(this['listItem'], {
				fill_color: {
					colors: [0x008899, 0x55CCFF]
				},
				text_format: {
					color: 0xFFFFFF
				},
				filters: {
					glow: {
						color: 0,
						alpha: 0.3,
						blurX: 2,
						blurY: 2,
						inner: true
					}
				}
			})
			
			this['listButton'] = uif_util.union(this['button'], {
				padding: 4,
				rounds: 0
			});
			
			var countLabel: Object = {
				fill_color: 0xFFFFFF,
				fill_alpha: 1,
				text_format: {
					font: TAHOMA,
					size: 9,
					color: 0x444555,
					align: 'center',
					selectable: false
				},
				filters: {
					shadow: {
						distance: 1,
						blurX: 2,
						blurY: 2,
						color: 0
					}
				}
			}
			
			this['countLabelL'] = uif_util.union(countLabel, {
				rounds: [0, 7, 7, 0]
			});

			this['countLabelR'] = uif_util.union(countLabel, {
				rounds: [7, 0, 0, 7]
			});
			
			this['checkbox'] = {
				text_format: {
					font: ARIAL,
					size: 13,
					multiline: true,
					selectable: false
				},
				hotspot: {
					margin: 4,
					rounds: 2,
					line_width: 2,
					line_color: 0xFFFFFF, 
					fill_color: {
						colors: [0xFFFFFF, 0xFFFFFF],
						rotation: Math.PI / 2
					},
					fill_alpha: 1,
					filters:{
						glow: {
							blurX: 2,
							blurY: 2
						}
					}
				},
				checkedStyle: 'cbChecked'
			}
			
			this['cbChecked'] = uif_util.union(this['checkbox'], {
				hotspot: uif_util.union(this['checkbox'].hotspot, {
					fill_color: {
						colors: [0x33FF33, 0x004400]
					}
				})
			});
			
			this['scrollHandle'] = {
				line_width: 1,
				line_color: 0x334455,
				line_alpha: 1,
				fill_color: 0xFFFFFF,
				fill_alpha: 1,
				filters: {
					shadow: {
						distance: 1,
						angle: 45,
						blurX: 2,
						blurY: 2,
						color: 0,
						strength: 1
					}
				}
			}
			
			this['barClass'] = {
				line_width: 1,
				line_color: 0,
				line_alpha: 1,
				fill_color: 0x444444,
				fill_alpha: 0.8
			}
			
			this['scrollbar'] = {
				line_width: 1,
				line_alpha: 0.1,
				rounds: 10,
				fill_color: 0xFFFFFF,
				fill_alpha: 1,
				buttonSize: 25,
				padding: 5,
				handleClass: 'scrollHandle',
				barClass: 'barClass'
			}
			
			this['rtbt'] = {
				focusStyle: 'rtbt_f',
				line_width: 1,
				line_alpha: 1,
				line_color: 0x444444,
				fill_color: 0x888888,
				fill_alpha: 0.9,
				text_format: {
					font: ARIAL,
					size: 11,
					bold: true,
					align: 'center',
					selectable: false
				},
				hotspot: {
					fill_color: 0xFFFFFF,
					fill_alpha: 0.6
				},
				filters: {
					glow: {
						alpha	: 0.2,
						blurX	: 4,
						blurY	: 4
					}
				}
			}
			
			this['rtbt_f'] = merge('rtbt', {
				fill_color: 0x666666,
				filters: {
					glow: {
						color: 0xFFFFFF,
						alpha: 1
					}
				}
			});
			
			this['rtbt_a'] = merge('rtbt', {
				fill_color: 0x33EE33,
				filters: {
					glow: {
						alpha: 1
					}
				}
			});
			
			this['hint'] = {
				fill_color: 0xFFFFFF,
				fill_alpha: 1,
				line_color: 0,
				line_alpha: 1,
				line_width: 1,
				rounds: 10,
				padding: 10,
				arrowSize: 15,
				text_format: {
					font: TAHOMA,
					size: 9,
					color: 0x666788,
					align: 'center',
					wordWrap: true,
					leading: -2
				},
				filters: {
					shadow: defShadow
				}
			}	
			
			this['sbhRed'] = merge('scrollHandle', {
				fill_color: 0xFF0000
			});			
			this['sbhGreen'] = merge('scrollHandle', {
				fill_color: 0x00FF00
			});			
			this['sbhBlue'] = merge('scrollHandle', {
				fill_color: 0x0000FF
			});			
			this['sbRed'] = merge('scrollbar', {
				handleClass: 'sbhRed'
			});			
			this['sbGreen'] = merge('scrollbar', {
				handleClass: 'sbhGreen'
			});			
			this['sbBlue'] = merge('scrollbar', {
				handleClass: 'sbhBlue'
			});
			
			this['comment'] = {
				text_format: {
					font		: TAHOMA,
					size		: 10,
					color		: 0x333333,
					wordWrap	: true
				}
			}
			
			this['timeCom'] = {
				text_format: {
					font		: TAHOMA,
					size		: 9,
					color		: 0x666788,
					wordWrap	: true
				}
			}
		}
	}
}